<template>
	<view class="position-fixed top-0 left-0 right-0 bottom-0 d-flex d-flex-middle d-flex-center" :class="bgClass" style="z-index: 10000;">
		<!-- <view class="color999 font26">
			加载中...
		</view> -->
		<view class="wx_loading_inner">
			<view class="wx_loading_icon"></view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"loadings",
		props:{
			bgClass:{
				type:String,
				default:'bg-fff'
			}
		}
	}
</script>
<style scoped>
.wx_loading_inner{position: relative;width: 200rpx;height: 200rpx}
.wx_loading_icon{position:absolute;top:30rpx;left:50%;margin-left:-32rpx;width:50rpx;height:50rpx;border:4rpx solid #fa2c19;border-radius:50rpx;-webkit-animation: gif 1s infinite linear;animation: gif 1s infinite linear;clip: rect(0 auto 25rpx 0)}
@keyframes gif{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform: rotate(1turn);transform:rotate(1turn)}}
@-webkit-keyframes gif{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(1turn)}}
</style>